﻿﻿<html>
<head>
    <title>管理中心</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!-- ExtJS -->
    <link rel="stylesheet" type="text/css" href="../lib/ext/resources/css/ext-all-neptune.css"/>
    <script type="text/javascript" src="../lib/ext/ext-all.js"></script>
    <script type="text/javascript" src="../lib/login_ok.js"></script>
    <!-- GC -->

</head>

<body>

<script type="text/javascript">

    //引入Extjs所有类
    Ext.require(['*']);







    Ext.onReady(function () {

        //弹出式描述功能初始化
        Ext.QuickTips.init();
        //使用cookie保存用户设置信息
        //Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));


        var store = Ext.create('Ext.data.TreeStore', {
            autoLoad : true,
            proxy : {
                type : 'ajax',
                url : '/res/ajax/list',//请求
                reader : {
                    type : 'json',
                    root : 'data'//数据
                }
            },
            root : {
                text : '管理菜单',
                expanded : true
            }
        });

        var tree = Ext.create('Ext.tree.Panel', {
            border: false,
            rootVisible: false,
            height: 65535,
            width: '100%',
            //useArrows : true,
            store : store,
            listeners: {//tree节点事件监听器
                //当点击节点时，执行函数：
                'itemclick': function (view, selectedItem) {
                    //获得tab容器tabpanel
                    var tabPanel = Ext.getCmp('tabPanel');
                    //获得被选中的tab组建对象
                    var tab = tabPanel.getComponent(selectedItem.data.id);
                    //如果此tab还未被创建，则向tab容器添加一个tab
                    if (!tab) {
                        tab = tabPanel.add({
                            id: selectedItem.data.id,
                            title: selectedItem.data.text,
                            closable: true,
                            autoWidth: true,
                            autoHeight: true,
                            active: true,//为了兼容IE9
                            html: '<iframe width="100%" height="100%" frameborder="0" src="' + selectedItem.data.hrefTarget + '"></iframe>'
                        });

                        //将tab设置为当前可见可操作tab
                        tabPanel.setActiveTab(tab);//其实这步是多余的，但是在IE9下，没这步就显示不正常。
                    }
                    //将tab设置为当前可见可操作tab
                    tabPanel.setActiveTab(tab);
                }
            }
        });


        //创建全景视图端
        var viewport = Ext.create('Ext.Viewport', {
            id: 'border-example',
            layout: 'border',//框式布局
            items: [

                // 创建一个通用组建实例
                Ext.create('Ext.Component', {
                    region: 'north',
                    height: 50,
                    hidden:false,
                    autoEl: {
                        tag: 'div',
                        html: '<h1 style="float:left">广发证券后台管理系统</h1><a href="/admin/logout" ' +
                                'style="font-size:20px;float:right;margin-right:20px;margin-top:20px;" >退出</a>'
                    }
                }), {
                    region: 'west',
                    stateId: 'navigation-panel',
                    id: 'west-panel',
                    title: '管理菜单',
                   // split: true,
                    width: 200,
                    minWidth: 175,
                    maxWidth: 400,
                    collapsible: true,
                    animCollapse: true,
                    margins: '0 0 0 5',
                    layout: 'fit',
                    items: tree
                },
                Ext.create('Ext.tab.Panel', {
                    id: 'tabPanel',
                    region: 'center', //中心区在框布局中是必须定义的
                    deferredRender: false,
                    activeTab: 0   //设置第一个选项卡为默认显示的
                })]
        });
        //展开tree的所有节点
        //Ext.getCmp('menu_tree').expandAll();
    });

</script>
</body>
</html>